<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-1.9.1.js"></script>
<script type="text/javascript">
	function deleteProduct(prid) {
		$.post("deleteProduct",{"prid":prid},function(data){
			if (data == "ok") {
				alert("删除成功");
				window.location.reload();
			}else {
				alert("删除失败");
				window.location.reload();
			}
		}
		);
	}
	
	function editCustomer(prid) {
		$("#msg1").text("");
		$.ajax({
			type:"get",
			url:"findProductById",
			data:{"prid":prid},
			success:function(data){
				$("#prid").val(data.prid);
				$("#roomnumber1").val(data.roomnumber);
				$("#price1").val(data.price);
				$("#type1>option[value = "+data.type+"]").attr("selected","selected")
			}
		});
	}
	
	$(function() {
		$("#preservationModify").click(function(){
			$.post("verificationProduct",{"roomnumber":$("#roomnumber1").val()},function(data){
				var pattern = /[1-9]\d*.\d*|0.\d*[1-9]\d*/;
				if($("#roomnumber1").val().length==0){
					$("#msg1").text("房间号不为空");
					return
				}
				if(data != null && data != ""){
					 if (data != $("#prid").val()) {
						 $("#msg1").text("房间号不重复");
						 return
					}
				}
				if($("#price1").val().length==0){
					 $("#msg1").text("价格不为空");
					 return
				}
				if(pattern.test($("#price1").val())==false){
					 $("#msg1").text("价格为小数或整数");
					 return
				}
				$.post("modifyproductstatus2",$("#editProduct").serialize(),function(data){
				if(data == "ok"){
					alert("修改成功");
					window.location.reload();
				}else{
					alert("修改失败");
					window.location.reload();
				}
				});
			
			});
		})
		
		$("#addProduct").click(function(){
			$.post("verificationProduct",{"roomnumber":$("#roomnumber2").val()},function(data){
				var pattern = /[1-9]\d*.\d*|0.\d*[1-9]\d*/;
				if($("#roomnumber2").val().length==0){
					$("#msg2").text("房间号不为空");
					return
				}
				if(data != null && data != ""){
					 if (data == $("#prid").val()) {
						 $("#msg2").text("房间号不重复");
						 return
					}
				}
			$.post("addProduct",$("#editProduct2").serialize(),function(data){
				if(data == "ok"){
					alert("添加成功");
					window.location.reload();
				}else{
					alert("添加失败");
					window.location.reload();
				}
			});
			});
		})
		
	})
	
		
	
	function modifyproductstatus(prid) {
		$.post("modifyproductstatus",{"prid":prid},function(data){
			if (data == "ok") {
				alert("退房成功");
				window.location.reload();
			}else {
				alert("退房失败");
				window.location.reload();
			}
		}
		);
	}
</script>
</head>
<body style="background-color: #23262E">
<%@include file="head.jsp" %>
<div class="dddiv" style="background-color: #F2F2F2;width: 1520px;height:800px;margin-left:auto;margin-right: auto;left: 0px;">
<div class="dadiv" style="top: 20px;height: 775px;">
    <div class="divbody" style="width: 1000px;left: 0px;">
		<table cellSpacing="1" cellPadding="0" width="100%" align="center" bgColor="#f5fafe" border="0">
				<tr>
					<td class="ta_01" align="center" bgColor="#23262E" style="color: #F2F2F2">
						<strong>查 询 条 件</strong>
					</td>
				</tr>
				<tr>
					<td>
					  <form action="${pageContext.request.contextPath}/admin/findProductByCondition" method="post"> 
						<table cellpadding="0" cellspacing="0" border="0" width="100%">
							<tr height="45px">
								<td height="22" align="center" class="ta_01" width="82px">房间号</td>
								<td class="ta_01">
									<input type="text" name="roomnumber" size="15" value="" id="Form1_userName" class="bg" />
								</td>
								<td height="22" align="center" class="ta_01" width="100px">房间类型：</td>
								<td class="ta_01">
								<select name="type" id="category">
										<option value="" selected="selected">--选择房间类别--</option>
										<option value="双人房">双人房</option>
										<option value="套房">套房</option>
										<option value="麻将房">麻将房</option>
										<option value="大床房">单人房</option>
								</select>
								</td>
								<td height="22" align="center" class="ta_01">价格:</td>
								<td class="ta_01">
								<select name="price" id="category">
										<option value="0" selected="selected">--价格--</option>
										<c:forEach items="${prices}" var="price">
											<option value="${price}">${price}</option>
										</c:forEach>
								</select>
								</td>
							</tr>
							<tr>
								<td align="center" class="ta_01" colspan="100%" height="60px">
									<button type="submit" id="search" value="&#26597;&#35810;" class="btn btn-success">
									&#26597;&#35810;
									</button> 
									&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 
									<input type="reset"  value="&#37325;&#32622;" class="btn btn-success" />
									&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 
									<button type="button" id="add" value="&#28155;&#21152;" class="btn btn-success" data-toggle="modal" data-target="#myModal2">
									&#28155;&#21152;
									</button>
								</td>
							</tr>
						  </table>
						</form>
					</td>
				</tr>
				<tr>
					<td class="ta_01" align="center" bgColor="#23262E" style="color: #F2F2F2"><strong>房 间 列 表</strong>
					</TD>
				</tr>
				<tr>
					<td class="ta_01" align="center" bgColor="#f5fafe">
						<table cellspacing="0" cellpadding="1" rules="all"
							bordercolor="gray" border="1" id="DataGrid1"
							style="BORDER-RIGHT: gray 1px solid; BORDER-TOP: gray 1px solid; BORDER-LEFT: gray 1px solid; WIDTH: 100%; WORD-BREAK: break-all; BORDER-BOTTOM: gray 1px solid; BORDER-COLLAPSE: collapse; BACKGROUND-COLOR: #f5fafe; WORD-WRAP: break-word">
							<tr style="FONT-WEIGHT: bold; FONT-SIZE: 12pt; HEIGHT: 25px; BACKGROUND-COLOR: #23262E;color: #F2F2F2">
								<td align="center" width="20%">房间号</td>
								<td align="center" width="12%">房间类型</td>
								<td align="center" width="9%">房间价格</td>
								<td align="center" width="9%">房间状态</td>
								<td width="8%" align="center">退房</td>
								<td width="8%" align="center">删除</td>
								<td width="8%" align="center">修改</td>
							</tr>
                            <!--  循环输出所有商品 -->
							<c:forEach items="${products}" var="p">
								<tr onmouseover="this.style.backgroundColor = 'white'"
									onmouseout="this.style.backgroundColor = '#F5FAFE';">
									<td style="CURSOR: hand; HEIGHT: 22px" align="center" width="200">${p.roomnumber}</td>
									<td style="CURSOR: hand; HEIGHT: 22px" align="center" width="18%">${p.type }</td>
									<td style="CURSOR: hand; HEIGHT: 22px" align="center" width="8%">${p.price }</td>
									<td style="CURSOR: hand; HEIGHT: 22px" align="center" width="8%">
									<c:if test="${p.state==1}">正在出租</c:if>
									<c:if test="${p.state==0}">未出租</c:if>
									</td>
									<td align="center" style="HEIGHT: 22px" width="7%">
									  <c:if test="${p.state == 1}">
									    <a href="#" class="btn btn-primary btn-block"  onclick="modifyproductstatus(${p.prid})">退房</a>
									</c:if>
									</td>
									<td align="center" style="HEIGHT: 22px" width="7%">
										<a href="#" class="btn btn-danger btn-block"  onclick="deleteProduct(${p.prid})">删除</a>	
									</td>
									<td align="center" style="HEIGHT: 22px" width="7%">
										<a href="#" class="btn btn-dark btn-block" data-toggle="modal" data-target="#myModal" onclick="editCustomer(${p.prid})">修改</a>	
									</td>
								</tr>
							</c:forEach>
						</table>
					</td>
				</tr>
					<div class="modal fade" id="myModal">
								<div class="modal-dialog modal-lg" role="document">
      								<div class="modal-content">
        								<div class="modal-header">
          									<h4 class="modal-title">房间信息修改</h4>
          									<button type="button" class="close" data-dismiss="modal">&times;</button>
        								</div>
        								<div class="alert alert-warning">
    											<span id="msg1"></span>
  										</div>
       								 	<div class="modal-body">
         									<form class="form-horizontal" id="editProduct">
         										<input type="hidden" id="prid" name="prid"/>
         										<div class="form-group">
         											<label for="roomnumber" class="col-2 control-label">房间号</label>
         											<div class="col-10">
         												<input type="text" class="form-control" id="roomnumber1" placeholder="房间号" name="roomnumber">
         											</div>
         										</div>
         										<div class="form-group">
         											<label for="price" class="col-sm-2 control-label">价格</label>
         											<div class="col-sm-10">
         												<input type="text" class="form-control" id="price1" placeholder="价格" name="price">
         											</div>
         										</div>
         										<div class="form-group">
         											<label for="type" class="col-sm-2 control-label">房间类型</label>
         											<div class="col-sm-10">
         												<select name="type" id="type1">
															<option value="双人房">双人房</option>
															<option value="套房">套房</option>
															<option value="麻将房">麻将房</option>
															<option value="大床房">单人房</option>
														</select>
         											</div>
         										</div>
         									</form>
        								</div>
        								<div class="modal-footer">
          									<button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
          									<button type="button" class="btn btn-dark" id="preservationModify">保存修改</button>
        								</div>
      								</div>
    							</div>
  							</div>
  							
  							
  							<div class="modal fade" id="myModal2">
								<div class="modal-dialog modal-lg" role="document">
      								<div class="modal-content">
        								<div class="modal-header">
          									<h4 class="modal-title">房间添加</h4>
          									<button type="button" class="close" data-dismiss="modal">&times;</button>
        								</div>
        								<div class="alert alert-warning">
    											<span id="msg2"></span>
  										</div>
       								 	<div class="modal-body">
         									<form class="form-horizontal" id="editProduct2">
         										<div class="form-group">
         											<label for="roomnumber" class="col-2 control-label">房间号</label>
         											<div class="col-10">
         												<input type="text" class="form-control" id="roomnumber2" placeholder="房间号" name="roomnumber">
         											</div>
         										</div>
         										<div class="form-group">
         											<label for="price2" class="col-sm-2 control-label">价格</label>
         											<div class="col-sm-10">
         												<input type="text" class="form-control" id="price" placeholder="价格" name="price">
         											</div>
         										</div>
         										<div class="form-group">
         											<label for="type" class="col-sm-2 control-label">房间类型</label>
         											<div class="col-sm-10">
         												<select name="type" id="type2">
															<option value="双人">双人房</option>
															<option value="套房">套房</option>
															<option value="大房间">大房间</option>
															<option value="麻将房">麻将房</option>
															<option value="单人">单人房</option>
														</select>
         											</div>
         										</div>
         										<div class="form-group">
         											<label for="state" class="col-sm-2 control-label">房间类型</label>
         											<div class="col-sm-10">
         												<select name="state" id="state">
															<option value="0">未出租</option>
															<option value="1">正在出租</option>
														</select>
         											</div>
         										</div>
         									</form>
        								</div>
        								<div class="modal-footer">
          									<button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
          									<button type="button" class="btn btn-dark" id="addProduct">添加房间</button>
        								</div>
      								</div>
    							</div>
  							</div>
		</table>
	</div>
	</div>
	</div>
</body>
</html>